<template>
	<view class="content">
		<u-search @search="search" @custom="search" placeholder="请输入任务名称" v-model="keyword" shape="round"
			style="background-color: white;"></u-search>
		<uni-segmented-control style="background-color: white; " inActiveColor="#a5a5a5" :current="currentIndex"
			:values="items" @clickItem="onClickItem" styleType="text" activeColor="#007aff" />
		<view v-if="this.dataList.length === 0">
			<image src="../../../static/images/u282.svg" style="display: flex; justify-content: center;width: 100%;">
				<view style="display: flex; justify-content: center;font-size: 20px;">当前无记录</view>
				<view style="display: flex; justify-content: center;color: #a5a5a5">当前没有找到需要您处理的记录</view>
			</image>:
		</view>
		<view v-else>
			<uni-card :is-shadow="false" style="margin-left: 2%;margin-right: 2%;" v-for="item in dataList"
				:key="item.taskId" :title="item.taskName" :sub-title="item.clientOrderCode"
				:extra="convertApprovingCount(item.approvingCount)" @click="cardClick(item)">
				<uni-row class="row-margin">
					<uni-col>
						<uni-row>
							<uni-col :span="16">
								<view>工单: {{item.workorderCode}}</view>
							</uni-col>
							<uni-col :span="8">
								<view>工艺: {{item.processName}}</view>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="16">
								<view>已完成: {{item.quantityQuanlify + ' ' + $convertUnitmeasure(item.unitOfMeasure)}}</view>
							</uni-col>
							<uni-col :span="8">
								<view>任务状态: {{$dict.selectDictLabel('mes_order_status', item.status)}}</view>
							</uni-col>
						</uni-row>
						<uni-row>
							<uni-col :span="16">
								<view>{{convertDate(item.endDate)}}</view>
							</uni-col>
							<uni-col :span="8">
								<view>报工次数: {{item.feedbackCount}}</view>
							</uni-col>

						</uni-row>
					</uni-col>
				</uni-row>
				<uni-row style="margin-top: 10px;">
					<uni-col :offset="19">
						<u-button shape="circle" size="mini" style="margin-left: 3px;" v-if="item.approvingCount <= 0"
							@click="viewRecordsClick(item)">查看记录</u-button>
						<u-button shape="circle" size="mini" style="margin-left: 3px;" v-else
							@click="auditRecordsClick(item)">去审核</u-button>
					</uni-col>
				</uni-row>
			</uni-card>
			<uni-row>
				<uni-col :span="24">
					<uni-pagination style="margin-left: 2%;margin-right: 2%;" :total="total" :current="pageNum"
						:pageSize="pageSize" @change="change" />
				</uni-col>
			</uni-row>
		</view>
	</view>
</template>

<script>
	import {
		listAuditTask
	} from "@/api/work/audit/audit"

	export default {
		data() {
			return {
				queryParam: {},
				dataList: [],
				items: ['全部', '待处理'],
				currentIndex: 0,
				pageNum: 1,
				total: 0,
				pageSize: 10,
				keyword: '',
				inActiveColor: '#a5a5a5'
			}
		},
		created() {
			this.list(this.pageNum);
		},
		onShow(){
			this.list(this.pageNum);
		},
		methods: {
			list(pageNum) {
				this.queryParam.pageNum = pageNum;
				this.queryParam.pageSize = this.pageSize;
				// 审核状态,0:全部,1:处理中,2:已处理;
				this.queryParam.currentIndex = this.currentIndex;
				this.queryParam.taskName = this.keyword;
				listAuditTask(this.queryParam).then(res => {
					this.dataList = res.rows;
					this.total = res.total;
				})
			},
			search() {
				this.list(this.pageNum);
			},
			viewRecordsClick(e) {
				let url = `/pages/work/audit/records?taskId=${e.taskId}&type=view`;
				this.$tab.navigateTo(url);
			},
			auditRecordsClick(e) {
				let url = `/pages/work/audit/records?taskId=${e.taskId}&type=modify`;
				this.$tab.navigateTo(url);
			},
			onClickItem(e) {
				if (this.currentIndex != e.currentIndex) {
					this.currentIndex = e.currentIndex;
					this.list();
				}
			},
			change(e) {
				this.list(e.current);
			},
			cardClick(e) {
				let url = `/pages/work/audit/records?taskId=${e.taskId}&type=view`;
				this.$tab.navigateTo(url);
			},
			convertDate(date) {
				return '交付日期: ' + this.$dayjs(date).format('YYYY-MM-DD');
			},
			convertApprovingCount(count) {
				return '待审核数量: ' + count;
			}
		}
	}
</script>

<style lang="scss">
	.row-margin uni-view {
		margin-top: 2px;
	}

	::v-deep .uni-card .uni-card__header .uni-card__header-extra .uni-card__header-extra-text {
		color: #7cabf2;
		font-size: 12px;
	}

	::v-deep .uni-card .uni-card__header .uni-card__header-content .uni-card__header-content-title {
		font-size: 15px;
		font-weight: bold;
		color: #3a3a3a;
	}
</style>